import React from 'react';
import { WebView, Animated, ActivityIndicator, Image, Keyboard, ScrollView, StyleSheet, Text, View, TouchableOpacity, Modal, TextInput, TouchableWithoutFeedback, DeviceEventEmitter, FlatList } from 'react-native';

import ScrollableTabView, { BadgedTabBar, DefaultTabBar } from 'react-native-scrollable-tab-view'
import { AlertDialog, SimpleItemsBottom, DatePicker } from 'react-native-pickers'
import ImagePicker from 'react-native-image-picker'
import CheckBox from 'react-native-check-box'
import RadioModal from '../Component/RadioModal'

import ScreenUtils from '../Utils/ScreenUtils'
import ColorUtils from '../Utils/ColorUtils'
import RouterUtils from '../Utils/RouterUtils'
import ToastUtils from '../Utils/ToastUtils'
import StorageUtils from '../Utils/StorageUtils'
import Constant from '../Constant/Constant'
import HttpUtils from '../Utils/HttpUtils'
import RuleUtils from '../Utils/RuleUtils'
import TimeUtils from '../Utils/TimeUtils'

export default class PageLwpcAdd extends React.Component
{
    static navigationOptions = ({navigation}) => ({
        gesturesEnabled: false,//是否支持滑动返回收拾，iOS默认支持，安卓默认关闭
        headerTitle: '新建采集',
        headerStyle: {
            backgroundColor: ColorUtils.blue,
            height: ScreenUtils.statusBarHeight,
        },
        headerRight: (<Text></Text>),
        headerTintColor: ColorUtils.white,
        headerTitleStyle: {
            fontSize: ScreenUtils.Font_18,
            color: ColorUtils.white,
            fontWeight: 'normal',
            flex: 1,
            alignSelf: 'center',
            textAlign: 'center',
        }
    });

    constructor(props)
    {
        super(props);
        this.state = {
            houseCollector: '',
            houseOwner: '',
            telNumber: '',
            address: '',
            doorNumber: '',
            comment: '',
        };
    }

    componentDidMount()
    {
        RouterUtils.pushRouter('PageLwpcAdd', this.props.navigation.state.key);
    }

    componentWillUnmount()
    {
        RouterUtils.popRouter('PageLwpcAdd', this.props.navigation.state.key);
    }

    casePublishClick()
    {
        try
        {
            // RuleUtils.checkEmpty(this.state.address, '地址不能为空')
            // RuleUtils.checkUnSelect(this.state.buildState, '请先选择');
            // RuleUtils.checkUnSelect(this.state.structureType, '请先选择');
            // RuleUtils.checkUnSelect(this.state.structureMethod, '请先选择');
            // RuleUtils.checkUnSelect(this.state.landStatus, '请先选择');
            var that = this;
            var data = {
                "houseCollector": this.state.houseCollector,
                "houseOwner": this.state.houseOwner,
                "telNumber": this.state.telNumber,
                "address": this.state.address,
                "doorNumber": this.state.doorNumber,
                "comment": this.state.comment,
            };
            console.log(JSON.stringify(data))
            StorageUtils.get('session').then((session) =>
            {
                if (session != '' && session != null)
                {
                    HttpUtils.postJsonWithRaw(Constant.lwpcReportAdd, session, JSON.stringify(data), function (resultcode, data)
                    {
                        ToastUtils.toastShortBottom('采集信息上报成功')
                        DeviceEventEmitter.emit('getLwpcList', 'param');
                        that.props.navigation.goBack();
                    }, function (resultcode, reason)
                    {
                        ToastUtils.toastShortBottom('错误码:' + resultcode + ',错误原因:' + reason);
                    });
                }
            });
        }
        catch (error)
        {
            ToastUtils.toastShortBottom(error);
        }
    }

    render()
    {
        return (
            <View style={styles.container}>
                <View style={{flexDirection: 'row', alignItems: 'center', height: 58, paddingTop: 8, paddingBottom: 8, paddingLeft: 16, paddingRight: 16, borderBottomWidth: 1, borderBottomColor: ColorUtils.line}}>
                    <Text style={{flex: 1, fontSize: ScreenUtils.Font_14, color: ColorUtils.black}}>采集人员</Text>
                    <TextInput value={this.state.houseCollector} underlineColorAndroid='transparent' keyboardType='default' maxLength={30} placeholder='请输入' onChangeText={(text) => this.setState({houseCollector: text})} multiline={true}
                               style={{color: ColorUtils.gray, fontSize: ScreenUtils.Font_14, width: 200, textAlign: 'right', marginRight: 8}}/>
                </View>
                <View activeOpacity={0.8} style={{flexDirection: 'row', alignItems: 'center', height: 58, paddingTop: 8, paddingBottom: 8, paddingLeft: 16, paddingRight: 16, borderBottomWidth: 1, borderBottomColor: ColorUtils.line}}>
                    <Text style={{flex: 1, fontSize: ScreenUtils.Font_14, color: ColorUtils.black}}>房屋户主</Text>
                    <TextInput value={this.state.houseOwner} underlineColorAndroid='transparent' keyboardType='default' maxLength={20} placeholder='请输入' onChangeText={(text) => this.setState({houseOwner: text})} multiline={true}
                               style={{color: ColorUtils.gray, fontSize: ScreenUtils.Font_14, width: 200, textAlign: 'right', marginRight: 8}}/>
                </View>
                <View activeOpacity={0.8} style={{flexDirection: 'row', alignItems: 'center', height: 58, paddingTop: 8, paddingBottom: 8, paddingLeft: 16, paddingRight: 16, borderBottomWidth: 1, borderBottomColor: ColorUtils.line}}>
                    <Text style={{flex: 1, fontSize: ScreenUtils.Font_14, color: ColorUtils.black}}>房屋地址</Text>
                    <TextInput value={this.state.address} underlineColorAndroid='transparent' keyboardType='default' maxLength={20} placeholder='请输入' onChangeText={(text) => this.setState({address: text})} multiline={true}
                               style={{color: ColorUtils.gray, fontSize: ScreenUtils.Font_14, width: 200, textAlign: 'right', marginRight: 8}}/>
                </View>
                <View activeOpacity={0.8} style={{flexDirection: 'row', alignItems: 'center', height: 58, paddingTop: 8, paddingBottom: 8, paddingLeft: 16, paddingRight: 16, borderBottomWidth: 1, borderBottomColor: ColorUtils.line}}>
                    <Text style={{flex: 1, fontSize: ScreenUtils.Font_14, color: ColorUtils.black}}>联系电话</Text>
                    <TextInput value={this.state.telNumber} underlineColorAndroid='transparent' keyboardType='default' maxLength={20} placeholder='请输入' onChangeText={(text) => this.setState({telNumber: text})} multiline={true}
                               style={{color: ColorUtils.gray, fontSize: ScreenUtils.Font_14, width: 200, textAlign: 'right', marginRight: 8}}/>
                </View>
                <View activeOpacity={0.8} style={{flexDirection: 'row', alignItems: 'center', height: 58, paddingTop: 8, paddingBottom: 8, paddingLeft: 16, paddingRight: 16, borderBottomWidth: 1, borderBottomColor: ColorUtils.line}}>
                    <Text style={{flex: 1, fontSize: ScreenUtils.Font_14, color: ColorUtils.black}}>门牌号码</Text>
                    <TextInput value={this.state.doorNumber} underlineColorAndroid='transparent' keyboardType='default' maxLength={20} placeholder='请输入' onChangeText={(text) => this.setState({doorNumber: text})} multiline={true}
                               style={{color: ColorUtils.gray, fontSize: ScreenUtils.Font_14, width: 200, textAlign: 'right', marginRight: 8}}/>
                </View>
                <View activeOpacity={0.8} style={{flexDirection: 'row', alignItems: 'center', height: 58, paddingTop: 8, paddingBottom: 8, paddingLeft: 16, paddingRight: 16, borderBottomWidth: 1, borderBottomColor: ColorUtils.line}}>
                    <Text style={{flex: 1, fontSize: ScreenUtils.Font_14, color: ColorUtils.black}}>备注信息</Text>
                    <TextInput value={this.state.comment} underlineColorAndroid='transparent' keyboardType='default' maxLength={20} placeholder='请输入' onChangeText={(text) => this.setState({comment: text})} multiline={true}
                               style={{color: ColorUtils.gray, fontSize: ScreenUtils.Font_14, width: 200, textAlign: 'right', marginRight: 8}}/>
                </View>

                <View style={{flexDirection: 'row', alignItems: 'center', marginLeft: 16, marginRight: 16, marginTop: 16, marginBottom: 100}}>
                    <TouchableOpacity activeOpacity={0.8} onPress={() => this.casePublishClick()} style={{marginLeft: 16, flex: 1, justifyContent: 'center', alignItems: 'center', height: 44, borderRadius: 6, backgroundColor: ColorUtils.blue}}>
                        <Text style={{color: ColorUtils.white, fontSize: ScreenUtils.Font_14}}>
                            上报数据
                        </Text>
                    </TouchableOpacity>
                </View>
            </View>
        );
    }
}

const styles = StyleSheet.create({
    container: {
        flex: 1,
        backgroundColor: ColorUtils.white,
    },
});


